<template>
<div class="add">
    <van-nav-bar
        left-text="返回新增地址"
        left-arrow
        @click-left="$router.go(-1)"
        />
    <!-- <van-address-edit
        ref='setAddressDetail'
        :area-list="areaList"
        show-search-result
        :show-area="false"
        :search-result="searchResult"
        :disable-area="true"
        :area-columns-placeholder="['请选择', '请选择', '请选择']"
        @save="onSave"
        /> -->
        <!-- 添加收货地址 -->
        <div class="content">
            <div class="t">
            联系人：<input type="text" v-model="input.name">
            </div>
            <div class="c">
            电话：<input type="text" v-model="input.phone">
            </div>
            <div class="b">
            地址：<input type="text" v-model="input.address">
            </div>
            <div class="btn">
                <button @click="request_address_build(input)">保存并使用</button>
            </div>
        </div>
    </div>
</template>

<script>
import {address_add} from '../utils/api'
import { mapState,mapMutations,mapGetters,mapActions } from 'vuex'

export default {
    data(){
        return {
            input:{
                // userid:this.$store.state.userid,
                userid:JSON.parse(localStorage.getItem('userinfo')).id,
                address:'',
                phone:'',
                name:'',
            }
        }
    },
    mounted(){
        // this.$store.dispatch('request_address_list');
    },
    computed:{
        // ...mapState(['userid']),
        // ...mapState(['addresslist']),
    },
    methods:{
        ...mapActions(['request_address_build']),
        // handelclick(){
            // this.input.userid = JSON.parse(localStorage.getItem('userinfo')).id;
        //     address_add(this.input).then((res)=>{
        //     console.log(res.data);
        // })
        // this.$store.dispatch('request_address_build',this.input);
        // this.$store.dispatch('request_address_list');
        // this.$router.go(-1);
        // }
        
    }
}

</script>

<style lang="scss" scoped>
.content{
    width: 100%;
    height: 80px;
    .t{
        display: flex;
        justify-content: space-around;
        align-items: center;
        height: 60px;
        line-height: 60px;
        // background-color:blanchedalmond ;
        input{
            padding: 0 20px;
            height: 30px;
            border: 0;
        }
    }
    .c{
        display: flex;
        justify-content: space-around;
        align-items: center;
        height: 60px;
        line-height: 60px;
        // background-color:blanchedalmond ;
        input{
            padding: 0 20px;
            height: 30px;
            border: 0;
        }
    }
    .b{
        display: flex;
        justify-content: space-around;
        align-items: center;
        height: 60px;
        line-height: 60px;
        // background-color:blanchedalmond ;
        input{
            padding: 0 20px;
            height: 30px;
            border: 0;
        }
    }
    .btn{
        // display: block;
        width: 100%;
        height: 50px;
        color: white;
        button{
            border:0;
            background-color: lightseagreen;
            display: block;
            margin: 0 auto;
            width: 90%;
            height: 50px;
        }
    }
}
</style>